<template>
	<view class="help">
		
		
		<uv-navbar autoBack placeholder bgColor="transparent" :fixed="false" title="意见反馈" ></uv-navbar>
		
		<view class="content">
			<uv-text text="建议内容" color="#333" size="28rpx" />
			<uv-gap height="10" bgColor="transparent" />
			<!-- <uv-text text="亲,谢谢您给我们提供的宝贵建议,帮助我们继续完善产品,谢谢!" color="#C8CAC9" size="24rpx" /> -->
			
			<uv-textarea v-model="areaText" border="bottom" placeholder="亲,谢谢您给我们提供的宝贵建议,帮助我们继续完善产品,谢谢!"></uv-textarea>
			
			<uv-gap height="30" bgColor="transparent" />
			
			
			<view class="upimg">
				<view class="img-box">
					<lst-upimg :type="1"  :maxCount="5"  @success="e => upimgSuccess(e, '反馈')"  name="反馈">
					</lst-upimg>
					<uv-text text="反馈图片，最多上传5张" color="#333" size="24rpx" align="center" />
				</view>	
			</view>
			
			
		</view>
		<uv-gap height="40" bgColor="transparent" />
		<view class="content1">
			<uv-button text="提交" color="#CC2B24" @click="onSubmit" />
		</view>
		
	</view>
</template>

<script setup>
	import {ref,reactive,computed} from 'vue';
    import { addFeedback } from '@/api'
	import { onLoad } from '@dcloudio/uni-app'
	const feedbackType=ref(1)
	
	const listImage = ref([]);
	const areaText = ref('');
	const upimgSuccess = (fileList, type) => {
		listImage.value=fileList
	}
	const onSubmit=()=>{
		let postData={}
		postData.type = feedbackType.value
		postData.content=areaText.value
		if(!postData.content){
			uni.$uv.toast('请输入反馈内容')
			return false;
		}
		if(listImage.value.length > 0){
			postData.images = listImage.value.map(({src}) => src);
			//postData.images = postData.images.join(',');
		}
		try {
		  const { result } = addFeedback(postData)
		  uni.$uv.toast('反馈提交成功')
		} catch (error) {
		  uni.$uv.toast('反馈提交失败')
		}
	}
	
	onLoad((options) => {
	 
	  if (options.feedback_type){
		  feedbackType.value = decodeURIComponent(options.feedback_type)*1
		  console.log('--feedbackType.value--',feedbackType.value)
	  } 
	 
	})

	
	
</script>

<style>
	page {
		background-color: #F6F4F7;
	}
</style>

<style lang="scss" scoped>
	
	.help {
		background-image: url('https://linshitong.oss-cn-shenzhen.aliyuncs.com/dev/image/2025/0812/09673202508121156597608.png');
		background-color: #efefef;
		background-position: top;
		/* 置顶 */
		background-repeat: no-repeat;
		/* 不重复 */
		background-size: 100% auto;
		/* 宽度撑满，高度自动保持比例 */
		min-height: 100vh;
		padding-top: calc(var(--status-bar-height) + 30rpx);
		width: 100vw;
	    .content {
			margin: 30rpx;
			padding: 40rpx 50rpx;
			border-radius: 20rpx;
			background-color: #fff;
		}
		.content1 {
			margin:  0 40rpx;
		}
		.upimg {
			display: flex;
			flex-direction: column;
			padding: 50rpx 0;
			align-items: center;
			justify-content: center;
			border-radius: 20rpx;
			background-color: #F6F4F7;
		}
	}
	
	.img-box{
		padding: 0 30rpx 0 50rpx;
		box-sizing: border-box;
		:deep(.uv-upload){
			
			box-sizing: border-box;
			align-items: center;
			
			
			
		}
	}
</style>